<template>
  <div>
    <div class="score mohu">
      <el-table
        v-loading="loading"
        element-loading-text="数据加载中"
        empty-text="暂无数据，请重新选择条件查询"
        :data="tableData"
        style="width: 100%; min-height: 280px"
      >
        <el-table-column prop="ssnf" label="年份" width="180" />
        <el-table-column prop="total" label="总招生人数" />
        <el-table-column prop="yzylqrs" label="一志愿人数" />
        <el-table-column prop="tjrs" label="调剂人数" />
        <el-table-column fixed="right" label="操作" width="60">
          <template #default="scope">
            <el-button
              link
              type="primary"
              size="small"
              @click="handleClick(scope.row)"
              >编辑</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <div v-if="isUnlock" class="mohu-filter">
        <el-button type="success" @click="onUnlock">
          <el-icon class="el-icon--right"><Key /></el-icon> <span>解锁</span>
        </el-button>
      </div>
    </div>
    <el-dialog
      v-model="editDialog"
      title="编辑招生人数"
      width="500px"
      :before-close="handleClose"
    >
      <div class="upload">
        <el-form
          ref="formRef"
          :model="formData"
          label-width="100px"
          class="demo-ruleForm"
          status-icon
        >
          <el-form-item label="总招生人数" prop="total">
            <el-input v-model="formData.total" />
          </el-form-item>
          <el-form-item label="一志愿人数" prop="yzylqrs">
            <el-input v-model="formData.yzylqrs" />
          </el-form-item>
          <el-form-item label="调剂人数" prop="tjrs">
            <el-input v-model="formData.tjrs" />
          </el-form-item>
        </el-form>
      </div>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="editDialog = false">取消</el-button>
          <el-button type="primary" @click="confirmEdit">确认</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>
<script setup>
import { ref, onMounted, defineProps } from "vue";
import { scoreAnalysis, correctMajorInfo } from "@/api/api";
import { decrypt } from "@/utils/parseDate";
import { defineEmits } from "vue";
import { ElMessage } from "element-plus";
const tableData = ref([]);
const props = defineProps({
  majorId: String,
});
const loading = ref(false);
async function getScoreAnalysis() {
  try {
    loading.value = true;
    const data = {
      majorOutRelationId: props.majorId,
    };
    const result = await scoreAnalysis(data);
    const res = JSON.parse(decrypt(result));
    console.log(res);
    if (res.status === 0) {
      res.result.forEach((ele) => (ele.total = ele.yzylqrs + ele.tjrs));
      tableData.value = res.result.reverse();
    }
    loading.value = false;
  } catch (error) {
    // throw new Error(error)
  }
}
function handleClick(row) {
  formData.value = {
    yzylqrs: row.yzylqrs,
    tjrs: row.tjrs,
    total: row.total,
    ssnf: row.ssnf,
  };
  editDialog.value = true;
}
const editDialog = ref(false);
function handleClose() {
  editDialog.value = false;
}
const formData = ref({});
const dataScholl = ref({});
async function confirmEdit() {
  console.log(dataScholl.value);
  dataScholl.value = {
    enrollRsps: [
      {
        yzylqrs: formData.value.yzylqrs,
        tjrs: formData.value.tjrs,
        total: formData.value.total,
        ssnf: formData.value.ssnf,
      },
    ],
    gradSchoolRsp: {
      majorOutRelationId: props.majorId,
    },
  };
  console.log(dataScholl.value);
  const result = await correctMajorInfo(dataScholl.value);
  const deRes = JSON.parse(decrypt(result));
  console.log(deRes);
  if (deRes.status === 0) {
    ElMessage.success("编辑成功!");
    getScoreAnalysis();
    editDialog.value = !editDialog.value;
  } else {
    ElMessage.warning("编辑失败!");
  }
}
// 将 myMethod 暴露给父组件
defineExpose({ childMethod });
function childMethod() {
  getScoreAnalysis();
}
onMounted(() => {
  getScoreAnalysis();
});
</script>
<style lang="less" scoped>
.mohu {
  position: relative;
  z-index: 9;
}

.mohu-filter {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 99;
  background-color: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
